<template>
	<view class="page">
		<!-- <cu-custom bgColor="bg-gradual-blue" :isBack="false">
		    <block slot="backText">返回</block>
		    <block slot="content"></block>
		</cu-custom> -->
		
		<cu-home ref="home" v-if="PageCur==='home'"></cu-home>
		<cu-work ref="work" v-if="PageCur==='work'"></cu-work>
		<cu-mine ref="mine" v-if="PageCur==='mine'"></cu-mine>
		
		<view class="cu-bar tabbar bg-white shadow foot">
			
			<view class="action" @click="NavChange" data-cur="home">
				<view class='cuIcon-cu-image'>
					<image :src="'/static/images/tabbar/home' + [PageCur=='home'?'_cur':''] + '.png'"></image>
				</view>
				<view :class="PageCur=='home'?'text-blue':'text-gray'">主页</view>
			</view>
			<view class="action" @click="NavChange" data-cur="work">
				<view class='cuIcon-cu-image'>
					<image :src="'/static/images/tabbar/work' + [PageCur=='work'?'_cur':''] + '.png'"></image>
				</view>
				<view :class="PageCur=='work'?'text-blue':'text-gray'">工作台</view>
			</view>
			<view class="action" @click="NavChange" data-cur="mine">
				<view class='cuIcon-cu-image'>
					<image :src="'/static/images/tabbar/mine' + [PageCur=='mine'?'_cur':''] + '.png'"></image>
				</view>
				<view :class="PageCur=='mine'?'text-blue':'text-gray'">我的</view>
			</view>
		</view>
		
		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				PageCur:'home',
			}
		},
		methods: {
			NavChange: function(e) {
				this.PageCur = e.currentTarget.dataset.cur
			}
		}
	}
</script>

<style>
	.container {
		/* padding: 20px;
		font-size: 14px;
		line-height: 24px; */
		background-color: #fff;
	}
	.cu-bar.foot {
		z-index: 1980;
	}
</style>
